<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap 101 Template</title>
    <link href="./style/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="./style/aa.css">
    <link rel="stylesheet" href="./style/swiper.min.css">
    <script src="./js/jquery-1.11.3.min.js"></script>
    <script src="./js/swiper.min.js"></script>
  </head>
  <body>			
		<div class="container-fluid">
		  	<div class="container header">
		 		<div class="tu">
		 			<img src="imgs/en_logo.png" alt="">
		 		</div>
			</div>
			<div class="container section">
		 			<div class="top">
		 				<div class="logo">
		 					<img src="./imgs/logo.png" alt="">
		 				</div>
		 				<div class="nav">
		 					<ul>
		 						<li class="color"><a href="" class="color">首页</a></li>
		 						<li><a href="">封面</a></li>
		 						<li><a href="">订阅</a></li>
		 						<li><a href="">微博</a></li>
		 					</ul>
		 				</div>
		 				<div class="serch">
		 					<input type="text" placeholder="Search">
		 				</div>
		 				<div class="login">
		 					<p>
		 						<a href="">登录</a>|
		 						<a href="">注册</a><br>
		 						<a href="">SEPTEMBER 2018/09/26</a>
		 					</p>
		 				</div>
		 			</div>
			</div>
			
			<div class="container main">
					<!-- 左边的列表栏 -->
		 			<div class="left_dao">
		 				<ul class="list" id="list">
		 					<li>
		 						<a href="./news.html">新闻质询</a>
		 					</li>
		 					<li>
		 						<a href="./redian.html">社会热点</a>
		 					</li>
		 					<li>
		 						<a href="">周刊首语</a>
		 					</li>
		 					<li>
		 						<a href="">封面故事</a>
		 						<span>vip</span>
		 					</li>
		 					<li>
		 						<a href="">特别报道</a>

		 						<span>vip</span>
		 					</li>
		 					<li>
		 						<a href="">事实观察</a>
		 						<span>vip</span>
		 					</li>
		 					<li>
		 						<a href="">现在视讯</a>
		 					</li>
		 					<li>
		 						<a href="">国际军情</a>
		 					</li>

		 					<li>
		 						<a href="">对话财经</a>
		 					</li>
		 					<li>
		 						<a href="">历史文化</a>
		 					</li>
		 					<li>
		 						<a href="">人物专栏</a>
		 					</li>
		 					<li>
		 						<a href="">资讯前线</a>
		 					</li>
		 					<li>
		 						<a href="">城市观察</a>
		 					</li>
		 				</ul>
		 			</div>
		 			<div class="maxBox">
		 				
		 				<!-- 轮播图 swiper -->
							<div class="swiper-container gallery-top">
    <div class="swiper-wrapper">
      <div class="swiper-slide" style="background-image:url(./imgs/1.jpg)"></div>
      <div class="swiper-slide" style="background-image:url(./imgs/2.jpg)"></div>
      <div class="swiper-slide" style="background-image:url(./imgs/3.jpg)"></div>
      <div class="swiper-slide" style="background-image:url(./imgs/4.jpg)"></div>
      <div class="swiper-slide" style="background-image:url(./imgs/5.jpg)"></div>
      <div class="swiper-slide" style="background-image:url(./imgs/6.jpg)"></div>
      <div class="swiper-slide" style="background-image:url(./imgs/7.jpg)"></div>
    </div>
    <!-- Add Arrows -->
    <div class="swiper-button-next swiper-button-white"></div>
    <div class="swiper-button-prev swiper-button-white"></div>
  </div>
  <div class="swiper-container gallery-thumbs">
    <div class="swiper-wrapper">
      <div class="swiper-slide" style="background-image:url(./imgs/1.jpg)"></div>
      <div class="swiper-slide" style="background-image:url(./imgs/2.jpg)"></div>
      <div class="swiper-slide" style="background-image:url(./imgs/3.jpg)"></div>
      <div class="swiper-slide" style="background-image:url(./imgs/4.jpg)"></div>
      <div class="swiper-slide" style="background-image:url(./imgs/5.jpg)"></div>
      <div class="swiper-slide" style="background-image:url(./imgs/6.jpg)"></div>
      <div class="swiper-slide" style="background-image:url(./imgs/7.jpg)"></div>
    </div>
  </div>

						<!-- swiper -->


					<div class="main_left">
						<p class="title">
							<a href="">光谷鼎新 | 总第664期</a>
						</p>
						<div class="comuln">
							<img src="./imgs/cou.gif" alt="">
							<ul>
								<h2>光谷鼎新</h2>
								<span>解码中国光谷30年生长基因</span>
								<li>订阅凤凰周刊540元/年<br>
                  每月3期 全年36期 每期15元</li>
								<li>华北地区订阅热线<br>
                  每月3期 全年36期 每期15元</li>
								<li>华南地区订阅热线<br>
                  每月3期 全年36期 每期15元</li>
							</ul>
						</div>

						<div class="hotdain">
							<p class="titletwo">
								<a href="">社会热点</a>
							</p>
							<h2>中国城市这么堵，真是因为人多吗？</h2>
							<p class="pc1"> 2018/09/25  	
							<a href=""> | 齐德龙 </a>			</p>
							<p class="pc2">
          每次堵在路上，都会忍不住思考一个终极问题：为什么我们的城市这么堵          ......          </p>
						</div>
						<div class="hotdain">
							<p class="titletwo">
								<a href="">封面故事</a>
							</p>
							<h2>光谷30年发展简史 <span>vip</span></h2>
							<p class="pc1"> 2018/09/25  	
							</p>
							<p class="pc2"> 从1984到2018。      </p>
						</div>

						<div class="hotdain">
							<p class="titletwo">
								<a href="">封面故事</a>
							</p>
							<h2>光谷光谱 风雨30年<span>vip</span></h2>
							<p class="pc1"> 2018/09/25  	</p>
							<p class="zzz">
								<img src="./imgs/o.gif" alt="">
							</p>
							<p class="pc2"> 从1984到2018。      </p>
						</div>
							
						<div class="hotdain">
							<p class="titletwo">
								<a href="">封面故事</a>
							</p>
							<h2>光谷光谱 风雨30年<span>vip</span></h2>
							<p class="pc1"> 2018/09/25  	</p>
							<p class="zzz">
								<img src="./imgs/r.jpg" alt="">
							</p>
							<p class="pc2"> 从1984到2018。      </p>
						</div>
						
						<div class="hotdain">
							<p class="titletwo">
								<a href="">封面故事</a>
							</p>
							<h2>光谷光谱 风雨30年<span>vip</span></h2>
							<p class="pc1"> 2018/09/25  	</p>
							<p class="zzz">
								<img src="./imgs/t.jpg" alt="">
							</p>
							<p class="pc2"> 从1984到2018。      </p>
						</div>
						
						<div class="hotdain">
							<p class="titletwo">
								<a href="">封面故事</a>
							</p>
							<h2>光谷光谱 风雨30年<span>vip</span></h2>
							<p class="pc1"> 2018/09/25  	</p>
							<p class="zzz">
								<img src="./imgs/zzz.jpg" alt="">
							</p>
							<p class="pc2"> 从1984到2018。      </p>
						</div>

						<div class="hotdain">
							<p class="titletwo">
								<a href="">封面故事</a>
							</p>
							<h2>光谷光谱 风雨30年<span>vip</span></h2>
							<p class="pc1"> 2018/09/25  	</p>
							<p class="pc2"> 
          
	现代意义上的动物园兴起于欧洲。一战结束，欧洲的工人运动兴起，各国陆续提高工人福利。奥地利在1919年实行带薪假期制，意大利、波兰、法国、英国和瑞典在1937年到1939年间也跟进。职工们有了假期可以带上全家去游玩，          ......               </p>
						</div>

						<div class="hotdain">
							<p class="titletwo">
								<a href="">封面故事</a>
							</p>
							<h2>光谷光谱 风雨30年<span>vip</span></h2>
							<p class="pc1"> 2018/09/25  	</p>
							<p class="pc2"> 
          
	现代意义上的动物园兴起于欧洲。一战结束，欧洲的工人运动兴起，各国陆续提高工人福利。奥地利在1919年实行带薪假期制，意大利、波兰、法国、英国和瑞典在1937年到1939年间也跟进。职工们有了假期可以带上全家去游玩，          ......           </p>
						</div>

					</div>
					<div class="main_right">
						<div class="couright">
							<p class="title"> 
								<a href="">纸刊订阅查询</a>
							</p>
							<form action="">
								<ul>
									<li>
										<input type="text" placeholder="收件人*">
									</li>
									<li>
										<input type="text" placeholder="电话号码*">
									</li>
									<li class="btn">
										<a href="">查询纸刊订阅</a>
									</li>
								</ul>
							</form>
						</div>
						<div class="ranking_list">
							<p class="ranking_title">
								<a href="">阅读排行</a>
							</p>
							<ul>
								<li>
									<a href="">凤凰周刊订阅</a>
									<span>2015/10/8</span>
								</li>
								<li>
										<a href="">历史中真实的《妖猫传》</a>
										<span>2015/10/8</span>
									</li>
								<li>
										<a href="">中共党政高官新矩阵</a>
										<span>2015/10/8</span>
									</li>
									<li>
											<a href="">反腐令中国私人飞机市场降温</a>
											<span>2015/10/8</span>
										</li>
										<li>
												<a href="">谷俊山贪腐内幕</a>
												<span>2015/10/8</span>
											</li>
											<li>
													<a href="">“营改增”过渡期问题待解</a>
													<span>2015/10/8</span>
												</li>
												<li>
														<a href="">大陆滥用抗生素警钟再起</a>
														<span>2015/10/8</span>
													</li>
													<li>
															<a href="">中共领导人的学科背景</a>
															<span>2015/10/8</span>
														</li>
														<li>
																<a href="">煤老板沉浮</a>
																<span>2015/10/8</span>
															</li>
															<li>
																	<a href="">韩巨头企业连遭重创背后</a>
																	<span>2015/10/8</span>
																</li>
							</ul>
						</div>
					</div>
		 			</div>
		 			<!-- max box 的尾 -->
			</div>
		</div>
		<footer>
				<div class="footer_top">
					<ul>
						<li>
								<a href="">周刊介绍</a>
								<a href="">广告服务</a>
								<a href="">推广合作</a>
								<a href="">联系我们</a>
						</li>
					</ul>
				</div>	
				<div class="footer_concat">
					<p class="pgo">友情链接<span></span></p>
					<p class="pgt">
						<a href="">凤凰周刊新浪微博</a>
						<a href="">凤凰网</a>
						<a href="">凤凰卫视</a>
						<a href="">凤凰周刊•生活</a>
						<a href="">凤凰城市</a>
						<a href="">香港中联办</a>
						<a href="">新浪</a>
						<a href="">腾讯</a>
						<a href="">东方头条</a>
						<a href="">引力资讯</a>
					</p>
					<p>
						<a href="">版权信息</a>
						<a href="">免责声明</a>
					</p>
					<p>
						<p> Copyright © 2018 香港凤凰周刊有限公司  |  京ICP备14045861号-1</p>
						<p>凤凰周刊 | 为全球华人提供独立意见</p>
					</p>
					<p> Copyright © 2018 香港凤凰周刊有限公司  |  京ICP备14045861号-1</p>
					<p>凤凰周刊网站所有刊登文章版权归香港凤凰周刊有限公司所有，任何转载或商业用途均须联系香港凤凰周刊有限公司。如未经授权用作他处，香港凤凰周刊有限公司将保留追究侵权者法律责任的权利。</p>
					<p></p>
				</div>
		</footer>


		<!-- 第二个布局 -->
		<div class="bujutwo">
			<div class="t_header">
				<div class="headerc">
					<img src="./imgs/en_logo.png" alt="">
				</div>
				<div class="headert">
					<img src="./imgs/logo(1).png" alt="">
				</div>
			</div>
			<!-- 内容 -->
			<div class="tow_content2">
				<nav>
					<ul class="navul">
						<li class="yan"><a href="">首页</a></li>
						<li><a href="">封面</a></li>
						<li><a href="">订阅</a></li>
						<li><a href="">微博</a></li>
						<li><a href="">登录</a></li>
					</ul>
				</nav>
				<div class="menu2">
					
					<span class="gang2">☰</span>
					<p>MENU | 
							周刊菜单    </p>
				</div>
				<div id="menu2_list" class="menu2_list">
					<!-- 列表 -->
					<ul class="menu_li">
							<li>
								<a href="./news.html">新闻质询</a>
							</li>
							<li>
								<a href="./redian.html">社会热点</a>
							</li>
							<li>
								<a href="">周刊首语</a>
							</li>
							<li>
								<a href="">封面故事</a>
								<span>vip</span>
							</li>
							<li>
								<a href="">特别报道</a>

								<span>vip</span>
							</li>
							<li>
								<a href="">事实观察</a>
								<span>vip</span>
							</li>
							<li>
								<a href="">现在视讯</a>
							</li>
							<li>
								<a href="">国际军情</a>
							</li>

							<li>
								<a href="">对话财经</a>
							</li>
							<li>
								<a href="">历史文化</a>
							</li>
							<li>
								<a href="">人物专栏</a>
							</li>
							<li>
								<a href="">资讯前线</a>
							</li>
							<li>
								<a href="">城市观察</a>
							</li>
						</ul>



					<!-- 列表// -->
				</div>
				<!-- 内容 -->
				<div class="main_left2">
						<p class="title2">
							<a href="">光谷鼎新 | 总第664期</a>
						</p>
						<div class="comuln2">
							<img src="./imgs/cou.gif" alt="">
							<ul>
								<h2>光谷鼎新</h2>
								<span>解码中国光谷30年生长基因</span>
								<li>订阅凤凰周刊540元/年<br>
                  每月3期 全年36期 每期15元</li>
								<li>华北地区订阅热线<br>
                  每月3期 全年36期 每期15元</li>
								<li>华南地区订阅热线<br>
                  每月3期 全年36期 每期15元</li>
							</ul>
						</div>

						<div class="hotdain2">
							<p class="titletwo2">
								<a href="">社会热点</a>
							</p>
							<h2>中国城市这么堵，真是因为人多吗？</h2>
							<p class="pc12"> 2018/09/25  	
							<a href=""> | 齐德龙 </a>			</p>
							<p class="pc22">
          每次堵在路上，都会忍不住思考一个终极问题：为什么我们的城市这么堵          ......          </p>
						</div>
						<div class="hotdain2">
							<p class="titletwo2">
								<a href="">封面故事</a>
							</p>
							<h2>光谷30年发展简史 <span>vip</span></h2>
							<p class="pc12"> 2018/09/25  	
							</p>
							<p class="pc22"> 从1984到2018。      </p>
						</div>

						<div class="hotdain2">
							<p class="titletwo2">
								<a href="">封面故事</a>
							</p>
							<h2>光谷光谱 风雨30年<span>vip</span></h2>
							<p class="pc12"> 2018/09/25  	</p>
							<p class="zzz2">
								<img src="./imgs/o.gif" alt="">
							</p>
							<p class="pc22"> 从1984到2018。      </p>
						</div>

						<div class="hotdain2">
								<p class="titletwo2">
									<a href="">封面故事</a>
								</p>
								<h2>光谷光谱 风雨30年<span>vip</span></h2>
								<p class="pc12"> 2018/09/25  	</p>
								<p class="zzz2">
									<img src="./imgs/r.jpg" alt="">
								</p>
								<p class="pc22"> 从1984到2018。      </p>
							</div>
							
							<div class="hotdain2">
								<p class="titletwo2">
									<a href="">封面故事</a>
								</p>
								<h2>光谷光谱 风雨30年<span>vip</span></h2>
								<p class="pc12"> 2018/09/25  	</p>
								<p class="zzz2">
									<img src="./imgs/t.jpg" alt="">
								</p>
								<p class="pc22"> 从1984到2018。      </p>
							</div>
							
							<div class="hotdain2">
								<p class="titletwo2">
									<a href="">封面故事</a>
								</p>
								<h2>光谷光谱 风雨30年<span>vip</span></h2>
								<p class="pc12"> 2018/09/25  	</p>
								<p class="zzz2">
									<img src="./imgs/zzz.jpg" alt="">
								</p>
								<p class="pc22"> 从1984到2018。      </p>
							</div>
	
							<div class="hotdain2">
								<p class="titletwo2">
									<a href="">封面故事</a>
								</p>
								<h2>光谷光谱 风雨30年<span>vip</span></h2>
								<p class="pc12"> 2018/09/25  	</p>
								<p class="pc22"> 
			  
		现代意义上的动物园兴起于欧洲。一战结束，欧洲的工人运动兴起，各国陆续提高工人福利。奥地利在1919年实行带薪假期制，意大利、波兰、法国、英国和瑞典在1937年到1939年间也跟进。职工们有了假期可以带上全家去游玩，          ......               </p>
							</div>
	
							<div class="hotdain2">
								<p class="titletwo2">
									<a href="">封面故事</a>
								</p>
								<h2>光谷光谱 风雨30年<span>vip</span></h2>
								<p class="pc12"> 2018/09/25  	</p>
								<p class="pc22"> 
			  
		现代意义上的动物园兴起于欧洲。一战结束，欧洲的工人运动兴起，各国陆续提高工人福利。奥地利在1919年实行带薪假期制，意大利、波兰、法国、英国和瑞典在1937年到1939年间也跟进。职工们有了假期可以带上全家去游玩，          ......           </p>
							</div>
	
			</div>
			
			<div class="footer">
					footer
			</div>
				

		</div>
    <script src="./js/jquery-1.11.3.min.js"></script>
	<script src="./js/bootstrap.min.js"></script>
	<script src="./js/index.js"></script>
  </body>
</html>
